.theme-light {
  --color-base: theme('colors.white');
  --color-text-base: theme('colors.gray.900');
}

.theme-dark {
  --color-base: theme('colors.gray.900');
  --color-text-base: theme('colors.white');
}

@layer base {
}

@layer components {
  html,
  body,
  #root {
    min-height: 100vh;
  }
  body {
    font-family:
      -apple-system,
      BlinkMacSystemFont,
      Segoe UI,
      Roboto,
      Oxygen,
      Ubuntu,
      Cantarell,
      Fira Sans,
      Droid Sans,
      Helvetica Neue,
      sans-serif;
  }

  a {
    cursor: pointer;
  }

  .btn {
    @apply h-40 bg-brand inline-flex items-center justify-center text-white px-4 py-2 rounded-md;
  }
  .content-area {
    height: calc(100vh - theme(space.96));
    color: theme(colors.brand);

    & > a {
      color: red;
    }
  }
}
